<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			.header,.footer{
				width: 700px;
				height: 100px;
				background-color: peachpuff;
				/*设置头部与尾部，上下边距为10px，左右边距为自动调整*/
				margin: 10px auto;
			}
			.main{
				height: 300px;
				width: 700px;
				margin: 0 auto;
			}
			.left_content{
				width: 490px;
				height: 300px;
				background-color: chocolate;
				margin: 5px 5px;
			}
			.sidebar{
				width: 190px;
				height: 300px;
				background-color: yellowgreen;
				margin: 5px 5px;
			}
			.left{
				float: left;
			}
			.right{
				float: right;
			}
		</style>
	</head>
	<body>
		<!--头部：头部可以是logo+搜索/导航栏--> 
		<div class="header"></div>
		<!--主体部分:左侧内容及右侧侧边栏-->
		<div class="main">
			<!--多类选择器，使用空格隔开选择器-->
			<div class="left_content left"></div>
			<div class="sidebar right"></div>
		</div>
		<!--尾部：网站的审批，地址，其他介绍-->
		<div class="footer"></div>
	</body>
</html>
